<style lang="scss" scoped>
	.content {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-bottom: 50rpx;
	}

	.nav {
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
		padding-bottom: 10rpx;
		border-bottom: 1px solid #dee2ee;
		background-color: white;
		z-index: 999;
	}

	.top {
		padding: 20rpx 30rpx;
	}

	.box {
		width: 690rpx;
		padding: 30rpx 20rpx;
		background: #ffffff;
		border-radius: 20rpx;
		box-shadow: 0rpx 32rpx 20rpx -20rpx #e6ebf2;
		margin-top: 30rpx;
		line-height: 60rpx;
		position: relative;

		.line {
			width: 100%;

			.f28 {
				width: 50%;
			}
		}

		.line2 {
			width: 100%;
			border-top: 1px solid #eeeeee;
			align-items: flex-start;

			.des {
				width: 520rpx;
				text-align: justify;
			}
		}

		.sbtn {
			width: 184rpx;
			height: 64rpx;
			background: #fffefe;
			border: 2rpx solid #409eff;
			border-radius: 34rpx;
		}

		.imgboxs {
			width: 100%;
			flex-wrap: wrap;

			.imgbox {
				width: 148rpx;
				height: 148rpx;
				border: 2rpx solid #dee2ee;
				border-radius: 10rpx;
				position: relative;
				margin-right: 18rpx;

				.photo {
					width: 100%;
					height: 100%;

				}

				.close {
					position: absolute;
					width: 32rpx;
					height: 32rpx;
					right: -16rpx;
					top: -16rpx;
				}
			}

			.imgbox:nth-child(4n) {

				margin-right: 0rpx;
			}
		}
	}

	.lbtn {
		margin: 60rpx auto;
	}

	.h1 {
		border-left: 6rpx solid #409eff;
		padding: 0 20rpx;
		transform: translateX(-20rpx);
		height: 40rpx;
		line-height: 40rpx;
	}

	.tip {
		width: 140rpx;
	}

	.clock {
		image {
			width: 30rpx;
			height: 30rpx;
			margin-right: 10rpx;
		}
	}

	.paybtn {
		width: 128rpx;
		height: 64rpx;
		border: 2rpx solid #409eff;
		border-radius: 34rpx;
		font-size: 28rpx;
		position: absolute;
		right: 20rpx;
		bottom: 30rpx;
	}

	.footer {
		width: 100%;
		background-color: white;
		position: fixed;
		bottom: 0;
		left: 0;
		border-top: 1px solid #cccccc;
		padding-left: 30rpx;
		padding-right: 30rpx;
		z-index: 100;

		.btn {
			width: 690rpx;
			height: 88rpx;
			opacity: 1;
			background: #ffffff;
			border: 2rpx solid #409eff;
			border-radius: 46rpx;
			margin: 30rpx;
		}
	}

	.header {
		color: #98A5B3;
		padding: 0 30rpx;
		width: 100%;
	}

	.footer {
		width: 100%;
		background-color: white;
		position: fixed;
		bottom: 0;
		left: 0;
		border-top: 1px solid #cccccc;
		padding-left: 30rpx;
		padding-right: 30rpx;
		z-index: 100;
	}


	.sbtn {
		width: 176rpx;
		height: 88rpx;
		border: 2rpx solid #dee2ee;
		border-radius: 46rpx;
	}

	.lbtn {
		width: 484rpx;
		margin-right: 0;
	}
</style>

<template>
	<view class="content">


		<view class="header between-flex m-top30 f28">
			<view>创建人:{{info.createUser | user}}</view>
			<view>创建时间:{{info.createTime}}</view>
		</view>

		<view class="box ">
			<view class="between-flex m-bottom20">
				<view class="f28 h1 bold textColor">项目信息</view>

			</view>

			<u-line></u-line>

			<view class="gray align-flex ">
				<view class="tip">项目名称</view>
				<view class="textColor ">{{info.title}}</view>
			</view>
			<view class="gray align-flex ">
				<view class="tip">项目描述</view>
				<view class="textColor ">{{info.remark}}</view>
			</view>
			<view class="gray  align-flex">
				<view class=" tip">起止时间</view>
				<view class="textColor ">
					{{info.startTime?info.startTime.substring(0,10):'-'}}至{{info.endTime?info.endTime.substring(0,10):'-'}}
				</view>
			</view>
			<view class="between-flex">
				<view class="gray  align-flex " style="width:50%;">
					<view class=" tip">审核人</view>
					<view class="textColor ">{{info.reviewer | users}}</view>
					
				</view>
				<view class="gray  align-flex" style="width:50%;">
					<view class="tip ">紧急程度</view>
					<view class="textColor ">{{info.priority | itemLevel}}</view>
				</view>
			</view>
			<view class="between-flex">
				<view class="gray  align-flex" style="width:50%;">
					<view class=" tip">负责人</view>
					<view class="textColor ">{{info.principal | users}}</view>
				</view>
				<view class="gray  align-flex" style="width:50%;">
					<view class=" tip">项目级别</view>
					<view class="textColor ">{{info.projectLevel | itemProjectLevel}}</view>
				</view>
			</view>
			<view class="gray  flex ">
				<view class="tip">参与人员</view>
				<view class="textColor " style="width:500rpx;">{{info.users }}
				</view>
			</view>
			<view class="flex" v-if="info.enclosure"><span class="c999 tip">附件:</span>
				<view>
					<view class="align-flex blue p-left10" v-for="item,index in info.enclosure" @click="$open(item.url)"
						:key="index">
						<u-icon name="file-text" color="#409EFF" size="38"></u-icon>
						{{item.name.substring(item.name.length-10)}}
					</view>
				</view>

			</view>
		</view>
		<view class="box">
			<view class="textColor f30 bold">计划方案</view>
		</view>
		<view class="box" v-for="item,index in work" :key="index">
			<view class="p-bottom30 between-flex">
				<view class="textColor f28 bold ">里程碑{{item.indexNum}}</view>

			</view>
			<view class="gray  align-flex">
				<view class=" tip">名称</view>
				<view class="textColor ">{{item.name}}</view>
			</view>
			<view class="gray  align-flex ">
				<view class=" tip">负责人</view>
				<view class="textColor ">{{item.principal | user}}</view>
			</view>
			<view class="gray  flex ">
				<view class="tip ">详细描述</view>
				<view class="textColor " style="width:500rpx;">{{item.remark?item.remark:'无'}}</view>
			</view>
			<view class="plan" v-if="item.children.length>0">
				<view class="gray bold">计划</view>
				<view v-for="item2,index2 in item.children" :key="index2">
					<view class="between-flex">
						<view class="one textColor bold">{{item2.indexNum}}{{item2.name}}</view>
					</view>
					<view class="gray  align-flex ">
						<view class=" tip">起止时间</view>
						<view class="textColor ">
							{{item2.startTime?item2.startTime.substring(0,16):'-'}}至{{item2.endTime?item2.endTime.substring(0,16):'-'}}
						</view>
					</view>
					<view class="between-flex">
						<view class="gray  align-flex" style="width:50%;">
							<view class=" tip">负责人</view>
							<view class="textColor ">{{item2.principal | user}}</view>
						</view>
						<view class="gray  align-flex" style="width:50%;">
							<view class=" ">预计工时（天）</view>
							<view class="textColor ">{{item2.planUse}}</view>
						</view>
					</view>
					<view class="gray flex">
						<view class=" tip">参与人员</view>
						<view class="textColor " style="width:500rpx;">{{item2.users }}
						</view>
					</view>

				</view>


			</view>
		</view>
		<view class="space"></view>
		<u-popup mode="bottom" v-model="showPopup" :closeable="true" borderRadius="20">
			<review v-if="showPopup" @confirm="accpet" @cancel="reject"></review>
		</u-popup>
		<view class="footer between-flex paddingBottom">
			<view class="sbtn center-flex textColor bold f32" @click="$back">取消</view>
			<view class="lbtn" @click="showPopup=true">评审</view>
		</view>
	</view>
</template>

<script>
	import review from '@/pagesProject/operation/review.vue'
	export default {
		components: {
			review
		},
		data() {
			return {
				head: this.$head,
				itemCode: 0,
				info: {},
				work: [],
				work2: [],
				process: [],
				showPopup: false
			}
		},
		onLoad(e) {

			this.itemCode = e.itemCode
			this.getInfo()
			this.getlist()
		},
		methods: {
			accpet() {
				var list = this.work2
				var ids = []
				list.forEach(item => {
					if(item.quoteId==0){
						ids.push(item.id)
					}
					
				})
				console.log(ids)

				var obj = {
					itemCode: this.itemCode,
					workIds: ids.join(',')
				}
				this.$showloading()
				this.$pop.ajaxPost("/busItemProcess/infoReview/pass", obj).then(res => {
					uni.hideLoading()
					if (res.code == 0) {
						this.showPopup=false
						this.$msg(res.msg)
						setTimeout(()=>{
							uni.navigateBack({
							
							})
						},1500)
						
					} else {
						this.$msg(res.msg)
					}
				})

			},
			reject(remark) {
				var list = this.work2
				var ids = []
				list.forEach(item => {
					if(item.quoteId==0){
						ids.push(item.id)
					}
					
				})
				console.log(ids)
				
				var obj = {
					itemCode: this.itemCode,
					workIds: ids.join(','),
					remark
				}
				this.$showloading()
				this.$pop.ajaxPost("/busItemProcess/infoReview/reject", obj).then(res => {
					uni.hideLoading()
					if (res.code == 0) {
						this.showPopup=false
						this.$msg(res.msg)
						setTimeout(()=>{
							uni.navigateBack({
								
							})
						},1500)
					} else {
						this.$msg(res.msg)
					}
				})
			},
			getInfo() {

				this.$pop.ajaxPost('/busItemInfo/getWorkDetail', {
					itemCode: this.itemCode
				}).then(res => {
					if (res.code == 0) {
						
						this.info = res.body.info
						if (this.info.enclosure) {
							this.info.enclosure = JSON.parse(this.info.enclosure)

						}
					}
				})

			},
			getlist() {
				this.$pop.ajaxPost('/busItemInfo/getWorkList', {
					itemCode: this.itemCode
				}).then(res => {


					var list = res.body
					this.work = []
					this.work2 = list
					this.plan = list[1]
					list.forEach(item => {
						if (item.parentId == 0) {
							item.children = []
							this.work.push(item)
						}
					})
					this.work.forEach(item => {
						list.forEach(item2 => {
							if (item2.parentId == item.id) {
								item.children.push(item2)
							}
						})
					})
					console.log(this.work)

				})
			},


		}
	}
</script>
